<?php get_header(); ?>
<?php
#定义本页面全局page_site_url函数，用于切换腾讯cos,如果要撤回的话直接删掉此方法，并修改页面中的page_site_url为site_url

    function page_site_url(){
        if(is_open_cos()){return get_cos_domain();}
        else return site_url();
    }

    //生成小程序码
    $post_id = get_the_ID();
    $post_type = get_post_type($post_id);

    $uploads = wp_upload_dir();
    $qrcode_path = $uploads['path'] . '/wxacode/';
    if (!is_dir($qrcode_path)) {
        mkdir($qrcode_path, 0755);
    }

    $qrcode = $qrcode_path . 'wxacode-' . $post_type . '-' . $post_id . '.png';
    $qrcode_link = $uploads['url'] . '/wxacode/' . 'wxacode-' . $post_type . '-' . $post_id . '.png';
    if (is_file($qrcode)) {
        // do nothing
    }else{
        $access_token = get_access_token();

        $api = 'https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=' . $access_token;

        $color = array(
            "r" => "0",  //这个颜色码自己到Photoshop里设
            "g" => "0",  //这个颜色码自己到Photoshop里设
            "b" => "0",  //这个颜色码自己到Photoshop里设
        );

        $page = 'pages/article/article';

        $data = array(
            'scene' => $post_id, //TODO 自定义信息，可以填写诸如识别用户身份的字段，注意用中文时的情况
            'page' => $page, // 前端传过来的页面path,不能为空，最大长度 128 字节
            'width' => 200, // 设置二维码尺寸,二维码的宽度
            'auto_color' => false, // 自动配置线条颜色，如果颜色依然是黑色，则说明不建议配置主色调
            'line_color' => $color, // auth_color 为 false 时生效，使用 rgb 设置颜色 例如 {"r":"xxx","g":"xxx","b":"xxx"},十进制表示
            'is_hyaline' => false, // 是否需要透明底色， is_hyaline 为true时，生成透明底色的小程序码
        );

        $args = array(
            'method'  => 'POST',
            'body' 	  => wp_json_encode($data),
            'headers' => array(),
            'cookies' => array()
        );

        $remote = wp_remote_post($api, $args);

        $content = wp_remote_retrieve_body($remote);
        if (strstr($content, 'errcode') !== false || strstr($content, 'errmsg') !== false) {
//            $json = json_decode($content, TRUE);
            // return $this->make_error($json['errmsg']);
            $qrcode_link = "https://www.17fpv.com/wp-content/uploads/2021/02/wxacode.jpg";
        }else{
            //输出二维码
            file_put_contents($qrcode, $content);

            //同步到媒体库
            //$this->handle_import_file($qrcode);
        }

    }


//是否倒流到小程序
$isDaoLiu = false;
$key = isset($_GET['key']) ? $_GET['key'] : '';
if($key){
    if(substr(md5(get_the_ID()."配置清单"),0,5) == $key){
        $isDaoLiu = false;
    }
}

?>
<style type="text/css">
    @media screen and (min-width: 400px) {
        .container-header {
            padding-bottom: calc(350px + 150 * (100vw - 400px) / 1520);
            padding-top: calc(20px + 10 * (100vw - 400px) / 1520);
        }
    }
    .container-header {
        position: relative;
        padding-bottom: 400px;
        padding-top: 20px;
        margin-top: -20px;
        background-size: cover !important;
        background-color: transparent;
        border: none;
        width: 100%;
        z-index: 3;
        background: url(<?php echo  is_open_cos() ? replace_cos_url(get_the_post_thumbnail_url()) : get_the_post_thumbnail_url(); ?>) no-repeat center center;
    }
    #lightgallery{
        position: relative;
    }
    .read-all {
        background: linear-gradient(rgba(255, 255, 255, .0), rgba(202, 199, 199, 1));
        text-align: center;
        width: 100%;
        height: 400px;
        position: absolute;
        bottom: 0;
        z-index: 10;
    }
    .read-all .text{
        display: block;
        bottom: 0;
        z-index: 11;
        border: 1px solid #f60;
        color: #f60;
        font-size: 15px;
        width: 150px;
        line-height: 29px;
        margin: 350px auto 0;
        border-radius: 5px;
    }
    .read-all .text:hover{
        cursor: pointer;
        color: white;
        background-color: #f60;
    }
    .hide-more{
        display: none;
    }
    .qrcode{
        text-align: center;
    }
    .qrcode img{
        width: 200px;
        margin: 15px;
    }
    .qrcode p{
        text-shadow: 0 0 2px rgb(253 107 0 / 60%);
        line-height: 30px;
    }
    <?php if($isDaoLiu){ ?>
    .water_mask a,.water_mask p,.price_mask {
        -webkit-filter: blur(5px);
        -moz-filter: blur(5px);
        -ms-filter: blur(5px);
        -o-filter: blur(5px);
        filter: blur(5px);
    }
    .water_mask:after{
        content: "微信扫码进入小程序，获取完整配置清单+购买链接";
        position: absolute;
        left: 0;
        top: 0;
        float:left;
        z-index: 100;
        line-height: 22px;
        padding: 10px 5px;
        font-size: calc(14px + 3 * (100vw - 400px) / 1520);
        text-shadow: 0 0 1px rgb(253 107 0 / 60%);
    }
    <?php } ?>
</style>
<div class="main-body mt-20">
    <div class="container-header"></div>
	<div class="container container-article">
		<div class="row d-flex flex-wrap">
			<!--主内容区-->
			<article class="column xs-12 sm-12 md-12 mb-10-xs mb-0-md">
				<?php if (have_posts()) : the_post();
					jiangqie_update_post_view_count();
				?>

					<div class="base-list search-list mb-20">
						<?php jiangqie_breadcrumbs(); ?>
						<div class="content-wrap">
							<div class="content-author mb-20">
								<h1><?php the_title(); ?></h1>
								<p class="simple-info mb-10-xs">
									<?php
									//作者头像和名称
									$detail_switch_author_avatar = jiangqie_option('detail_switch_author_avatar');
									$detail_switch_author_name = jiangqie_option('detail_switch_author_name');
									if ($detail_switch_author_avatar || $detail_switch_author_name) : ?>
										<a href="<?php echo get_author_posts_url(get_the_author_meta('ID')); ?>" title="<?php the_author() ?>">
											<?php if ($detail_switch_author_avatar) :
												jiangqie_avatar(get_the_author_meta('ID'));
											endif; ?>
											<?php if ($detail_switch_author_name) : ?>
												<em><?php the_author() ?></em>
											<?php endif; ?>
										</a> ·
									<?php endif; ?>
									<!-- 浏览数 -->
									<?php jiangqie_post_detail_view_count(); ?>
									<!-- 点赞数 -->
									<?php jiangqie_post_detail_thumbup_count(); ?>
									<!-- 评论数 -->
									<?php jiangqie_post_detail_comment_count(); ?>
									<!-- 发布时间 -->
									<cite><?php echo jiangqie_time_ago(get_gmt_from_date(get_the_time('Y-m-d G:i:s'))); ?></cite>
								</p>
							</div>

							<div class="content-view mb-20">
                                <p style="font-weight: 600;background-color: #FF3D00;color: white;padding: 5px;">官方淘宝店铺：FPV ONE 穿越机（<a href="https://shop585122793.taobao.com/" style="color:white">跳转链接</a>）</p>
                                <div class="mb-20">
<!--                                    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>-->
<!--                                    <ins class="adsbygoogle"-->
<!--                                         style="display:block; text-align:center;"-->
<!--                                         data-ad-layout="in-article"-->
<!--                                         data-ad-format="fluid"-->
<!--                                         data-ad-client="ca-pub-6243451787655828"-->
<!--                                         data-ad-slot="5893618997"></ins>-->
<!--                                    <script>-->
<!--                                        (adsbygoogle = window.adsbygoogle || []).push({});-->
<!--                                    </script>-->
                                </div>
                                <?php the_content(); ?>
							</div>


                            <?php
                            //图片信息
                                global $wpdb;
                                $photos = $wpdb->get_row("select photos from spider_fpv where wp_posts_id=" . get_the_ID() )->photos;
                                $photos = empty($photos) ? [] : explode(',', $photos);

                            ?>
                            <div id='lightgallery'>
                                <?php
                                foreach ($photos as $i => $photo) {?>
                                    <?php if ($i < 3){ ?>
                                        <a href='<?php echo page_site_url().$photo; ?>'>
                                            <img src="<?php echo page_site_url().$photo.tinyjpg(); ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>" />
                                        </a>
                                    <?php }else{ ?>
                                        <?php if($i==3){ ?>
                                            <!-- 查看所有图片 -->
                                            <div class="read-all"><p class="text">点击查看所有图片</p></div>
                                        <?php } ?>
                                        <a href='<?php echo page_site_url().$photo; ?>' class="hide-more">
                                            <img src="<?php echo site_url()."/wp-content/themes/jiangqie/images/image-loading.gif"; ?>" class="lazy" data-original='<?php echo page_site_url().$photo.tinyjpg(); ?>' alt="<?php the_title(); ?>" title="<?php the_title(); ?>"  />
                                        </a>
                                    <?php } ?>
                                <?php } ?>

                            </div>

                            <div class="mt-20">
                            </div>

                                <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
                                <!-- 【横】长方形广告 -->
                                <ins class="adsbygoogle"
                                     style="display:block"
                                     data-ad-client="ca-pub-6243451787655828"
                                     data-ad-slot="4209566881"
                                     data-ad-format="auto"
                                     data-full-width-responsive="true"></ins>
                                <script>
                                    (adsbygoogle = window.adsbygoogle || []).push({});
                                </script>

                            <?php if($isDaoLiu){ ?>
                            <div class="qrcode">
                                <img src="<?php echo $qrcode_link; ?>">
                                <p>👆&nbsp;手机截图->微信扫码</p>
                                <p>查看完整配置清单+购买链接</p>
                            </div>
                            <?php } ?>

                            <?php
                            //配置清单
                                global $wpdb;
                                $parts = $wpdb->get_results("select parts.id,parts.img,parts.url,parts.price,parts_type.type,parts.name as product_name,parts_type.name as part_name from fpv_parts 
                                                                    left join parts on parts.id=fpv_parts.parts_id
                                                                    left join parts_type on parts_type_id=parts_type.id
                                                                    where fpv_id=".get_the_ID()."
                                                                    order by sort ASC");

                                $geal_list = [];
                                $part_list = [];

                                //临时记录上一个part_name和gear_name
                                $prev_part_name = "";
                                $prev_gear_name = "";
                                foreach ($parts as $p){
                                    if($p->type=='part'){
                                        if ($prev_part_name == $p->part_name){
                                            $p->part_name = "";
                                        }else{
                                            $prev_part_name = $p->part_name;
                                        }
                                        $part_list[] = $p;
                                    }
                                    if($p->type=='gear'){
                                        if ($prev_gear_name == $p->part_name){
                                            $p->part_name = "";
                                        }else{
                                            $prev_gear_name = $p->part_name;
                                        }
                                        $geal_list[] = $p;
                                    }
                                }
                            ?>
                            <?php if ($part_list) { ?>
                                <div id="components">
<!--                                    <h1>配置清单</h1>-->
                                    <section style="text-align: center;margin:10px 0;line-height: 32px;"><section style="display:inline-block;"><section style="margin-right:20px;"><section style="width:14px;height:14px;background-color:#c3c7c8;border-radius:50%;bordeR:solid 3px #fefefe;transform: rotatez(0deg);"></section><section style="margin-top:-7px;margin-left:7px;border-top:solid 2px #c3c7c8;border-left:solid 2px #c3c7c8;width:100%;height:40px;" data-width="100%"></section></section><section style="margin:-33px 25px;"><p style="letter-spacing: 2px;">配置清单</p></section><section style="margin-left:20px;"><section style="margin-bottom: -7px;margin-left: -7px;border-bottom:solid 2px #c3c7c8;border-right:solid 2px #c3c7c8;width:100%;height:40px;" data-width="100%"></section><section style="width:14px;height:14px;background-color:#c3c7c8;border-radius:50%;bordeR:solid 3px #fefefe;transform: rotatez(0deg);margin-left:auto;"></section></section></section></section>
                                    <table class="table table-striped table-hover">
                                        <tbody>
                                        <?php foreach ($part_list as $idx => $pl) { ?>
                                            <tr data-type="" class="<?php if($pl->part_name){echo 'first-tag';} ?>">
                                                <td class="tag"><h4><?php echo $pl->part_name; ?></h4></td>
                                                <td class="name <?php if($idx>=2) echo "water_mask"; ?>">
                                                        <?php if($isDaoLiu){ ?>
                                                            <p><?php echo $pl->product_name; ?></p>
                                                        <?php }else{ ?>
                                                            <?php if(empty($pl->url)){ ?>
                                                                <a href="<?php echo site_url()."/category/parts/info/".$pl->id.".html"; ?>" target="_new"><?php echo $pl->product_name; ?></a>
                                                            <?php }else{ ?>
                                                                <a href="<?php echo $pl->url ?>" target="_new"><?php echo $pl->product_name; ?></a>
                                                            <?php } ?>
                                                            <!--<span class="matches"><a href="/part/47044">(11 builds)</a></span>-->
                                                            <!--<div class="vendor">Betafpv.com</div>-->
                                                        <?php } ?>
                                                </td>
                                                <td class="price<?php if($idx>=2) echo " price_mask"; ?>">
                                                    <?php if($isDaoLiu){ ?>
                                                         --
                                                    <?php }else{ ?>
                                                        <?php if(empty($pl->url)){ ?>
                                                            <a href="<?php echo site_url()."/category/parts/info/".$pl->id.".html"; ?>" target="_new">更多</a>
                                                        <?php }else{ ?>
                                                            <span>¥<?php echo $pl->price; ?></span>
                                                        <?php } ?>
                                                    <?php } ?>
                                                </td>
                                            </tr>
                                        <?php } ?>
                                        </tbody>
                                    </table>
<!--                                    <a href="#" class="total_vendors">Show stores (9)</a>-->
<!--                                    <div class="prices">-->
<!--                                        <div class="base_price">$298.96</div>-->
<!--                                        <div class="help" data-toggle="tooltip" data-placement="top" title="" data-original-title="Base price excludes batteries, props, receivers and misc parts."><i class="icon-help1"></i></div>-->
<!--                                        <div class="total_price">$396.42</div>-->
<!--                                    </div>-->
                                </div>
                            <?php } ?>

                            <?php if($geal_list){ ?>
                                <div id="components">
<!--                                    <h1>配置清单</h1>-->
                                    <section style="text-align: center;margin:10px 0;line-height: 32px;">
                                        <section style="display:inline-block;">
                                            <section style="margin-right:20px;"><section style="width:14px;height:14px;background-color:#c3c7c8;border-radius:50%;bordeR:solid 3px #fefefe;transform: rotatez(0deg);"></section><section style="margin-top:-7px;margin-left:7px;border-top:solid 2px #c3c7c8;border-left:solid 2px #c3c7c8;width:100%;height:40px;" data-width="100%"></section></section><section style="margin:-33px 25px;">
                                                <p style="letter-spacing: 2px;">装备推荐</p>
                                            </section><section style="margin-left:20px;">
                                                <section style="margin-bottom: -7px;margin-left: -7px;border-bottom:solid 2px #c3c7c8;border-right:solid 2px #c3c7c8;width:100%;height:40px;" data-width="100%">
                                                </section><section style="width:14px;height:14px;background-color:#c3c7c8;border-radius:50%;bordeR:solid 3px #fefefe;transform: rotatez(0deg);margin-left:auto;"></section></section></section></section>

                                    <table class="table table-striped table-hover">
                                        <tbody>
                                        <?php foreach ($geal_list as $gl) { ?>
                                            <tr data-type="" class="<?php if($gl->part_name!==''){echo 'first-tag';} ?>">
                                                <td class="tag"><h4><?php echo $gl->part_name; ?></h4></td>
                                                <td class="name water_mask">
                                                    <?php if($isDaoLiu){ ?>
                                                        <p><?php echo $gl->product_name; ?></p>
                                                    <?php }else{ ?>
                                                        <?php if(empty($gl->url)){ ?>
                                                            <a href="<?php echo site_url()."/category/parts/info/".$gl->id.".html"; ?>" target="_new"><?php echo $gl->product_name; ?></a>
                                                        <?php }else{ ?>
                                                            <a href="<?php echo $gl->url ?>" target="_new"><?php echo $gl->product_name; ?></a>
                                                        <?php } ?>
                                                        <!--<span class="matches"><a href="/part/47044">(11 builds)</a></span>-->
                                                        <!--<div class="vendor">Betafpv.com</div>-->
                                                    <?php } ?>
                                                </td>
                                                <td class="price price_mask">
                                                    <?php if($isDaoLiu){ ?>
                                                        --
                                                    <?php }else{ ?>
                                                        <?php if(empty($gl->url)){ ?>
                                                            <a href="<?php echo site_url()."/category/parts/info/".$gl->id.".html"; ?>" target="_new">更多</a>
                                                        <?php }else{ ?>
                                                            <span>¥<?php echo $gl->price; ?></span>
                                                        <?php } ?>
                                                    <?php } ?>
                                                </td>
                                            </tr>
                                        <?php } ?>
                                        </tbody>
                                    </table>
<!--                                    <a href="#" class="total_vendors">Show stores (9)</a>-->
<!--                                    <div class="prices">-->
<!--                                        <div class="base_price">$298.96</div>-->
<!--                                        <div class="help" data-toggle="tooltip" data-placement="top" title="" data-original-title="Base price excludes batteries, props, receivers and misc parts."><i class="icon-help1"></i></div>-->
<!--                                        <div class="total_price">$396.42</div>-->
<!--                                    </div>-->
                                </div>
                            <?php } ?>

							<?php
							//标签信息
							$detail_switch_tag = jiangqie_option('detail_switch_tag');
							if ($detail_switch_tag) : ?>
								<div class="content-tag mb-20">
									<div class="tag-list">
										<?php the_tags('', '', '') ?>
									</div>
								</div>
							<?php endif; ?>

							<?php
							//版权信息
							$detail_switch_copyright = jiangqie_option('detail_switch_copyright');
							if ($detail_switch_copyright) : ?>
								<div class="content-copy mb-20">
									<p><?php echo jiangqie_option('detail_copyright'); ?></p>
								</div>
							<?php endif; ?>

							<?php
							//点赞和打赏
							$detail_switch_thumbup = jiangqie_option('detail_switch_thumbup');
							$detail_switch_reward = jiangqie_option('detail_switch_reward');
							if ($detail_switch_thumbup || $detail_switch_reward) : ?>
								<div class="content-opt mb-20">
									<div class="content-opt-wap">
										<?php if ($detail_switch_thumbup) : ?>
											<div>
												<a href="javascript:;" data-action="jaingqie_thumbup" data-id="<?php the_ID(); ?>" class="btn-thumbup <?php if (isset($_COOKIE['jaingqie_thumbup_' . $post->ID])) echo ' done'; ?>">
													<img alt="" src="<?php echo get_stylesheet_directory_uri() . '/images/zan.png'; ?>" alt="">
													<?php $thumbup = get_post_meta($post->ID, 'jaingqie_thumbup', true); ?>
													<p>已有<cite class="count"><?php echo $thumbup ? $thumbup : '0'; ?></cite>人点赞</p>
												</a>
											</div>
										<?php endif; ?>
										<?php if ($detail_switch_reward) : ?>
											<div>
												<a href="javascript:;" class="btn-reward">
													<img alt="" src="<?php echo get_stylesheet_directory_uri() . '/images/shang.png'; ?>" alt="">
													<p>打赏一下作者</p>
												</a>
											</div>
										<?php endif; ?>
									</div>
								</div>
								<div id="reward-div" style="display: none;">
									<?php jiangqie_reward_image() ?>
								</div>
							<?php endif; ?>

						</div>

						<?php
						//猜你喜欢
						$detail_switch_recommend = jiangqie_option('detail_switch_recommend');
						if ($detail_switch_recommend) : ?>
							<h5 class="mb-20">猜你喜欢</h5>
							<div class="row d-flex flex-wrap mb-20">
								<?php
								$args = array(
									'post_status' => 'publish',
									'post__not_in' => [$post->ID],
									'ignore_sticky_posts' => 1,
									'orderby' => 'comment_date',
									'posts_per_page' => 8
								);
								$posttags = get_the_tags();
								if ($posttags) {
									$tags = '';
									foreach ($posttags as $tag) {
										$tags .= $tag->term_id . ',';
									}
									$args['tag__in'] = explode(',', $tags);
								}
								query_posts($args);
								while (have_posts()) {
									the_post();
									$thumbnail = jiangqie_thumbnail_src();
									if (empty($thumbnail)) {
										$thumbnail = get_stylesheet_directory_uri() . '/images/jiangqie.png';
									}
								?>
									<div class="column md-4 easy-item">
										<figure class="relative">
											<div>
												<a href="<?php the_permalink(); ?>">
													<img src="<?php echo site_url()."/wp-content/themes/jiangqie/images/image-loading.gif"; ?>" class="lazy" data-original='<?php echo $thumbnail; ?>' alt="<?php the_title(); ?>">
												</a>
											</div>
										</figure>
										<figcaption class="title">
											<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
										</figcaption>
									</div>
								<?php
								}
								wp_reset_query();
								?>
							</div>
						<?php endif; ?>

                        <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
                        <!-- 【横】长方形广告 -->
                        <ins class="adsbygoogle"
                             style="display:block"
                             data-ad-client="ca-pub-6243451787655828"
                             data-ad-slot="4209566881"
                             data-ad-format="auto"
                             data-full-width-responsive="true"></ins>
                        <script>
                            (adsbygoogle = window.adsbygoogle || []).push({});
                        </script>

						<!-- 评论 -->
						<?php comments_template(); ?>

					</div>

				<?php else : ?>
					<div class="base-list search-list mb-20">
						<?php jiangqie_breadcrumbs(); ?>
						<div class="content-wrap">
							<div class="content-view mb-20">
								没有找到文章！
							</div>
						</div>
					</div>
				<?php endif; ?>

			</article>

			<!--侧边栏-->
			<?php //get_sidebar(); ?>
		</div>
	</div>
</div>

<!--components-->
<link rel='stylesheet' id='build-css'  href='<?php echo site_url(); ?>/wp-content/themes/jiangqie/css/mycomponents.css?ver=5.6' type='text/css' media='all' />
<!--lightGallery.js-->
<link rel='stylesheet' id='build-css'  href='<?php echo site_url(); ?>/wp-content/themes/jiangqie/css/mygallery.css?ver=5.6' type='text/css' media='all' />
<link rel='stylesheet' id='build-css'  href='<?php echo site_url(); ?>/wp-content/themes/jiangqie/css/lightgallery.css?ver=5.6' type='text/css' media='all' />
<script type='text/javascript' src='<?php echo site_url(); ?>/wp-content/themes/jiangqie/js/lightgallery.js?ver=0.3' id='lg-js'></script>
<script type='text/javascript' src='<?php echo site_url(); ?>/wp-content/themes/jiangqie/js/lg-thumbnail.js?ver=0.3' id='lg-thumbnail-js'></script>
<script type='text/javascript' src='<?php echo site_url(); ?>/wp-content/themes/jiangqie/js/lg-fullscreen.js?ver=0.3' id='lg-fullscreen-js'></script>
<!--lazyload.js-->
<script type='text/javascript' src='<?php echo site_url(); ?>/wp-content/themes/jiangqie/js/jquery.lazyload.min.js'></script>

<!--layer.js-->


<script type="text/javascript">
    var $ = jQuery.noConflict();//解除wordpress jquery限制

    $(document).ready(function() {
        //设置标题头偏移
        _offset1 = $("article").offset().top;
        _offset2 = $(".content-view").offset().top;
        _margin_top = _offset1 - _offset2;
        $("div.container-article").css("z-index", 10);
        $("div.container-article").css("margin-top", _margin_top + 20);


        $('img.lazy').lazyload();

        $('.read-all').click(function () {
            $("#lightgallery a").each(function(){
                $(this).removeClass("hide-more");
            });
            $(this).remove();
            //启动lightgaller
            $("#lightgallery").lightGallery();
        });


    });
</script>

<?php get_footer(); ?>
